<!-- 注意这里不需要写`<html><body>`这些东西，它是一个html片段，不是完整的html页面 -->
<form id="addOrUpdateForm" lay-filter="addOrUpdateForm" class="layui-form model-form">
    <input name="id" type="hidden"/>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">主题标题：</label>
        <div class="layui-input-block">
            <input name="title" class="layui-input" placeholder="请输入主题标题" lay-verType="tips" lay-verify="required"
                   required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">主题价格：</label>
        <div class="layui-input-block">
            <input name="price" class="layui-input" placeholder="请输入主题价格" lay-verType="tips" lay-verify="required"
                   required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">主题图片url：</label>
        <div class="layui-input-block">
            <input name="image" class="layui-input" lay-verify="required" placeholder="请输入主题图片url" lay-verType="tips"
                   required/>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">主题版本：</label>
        <div class="layui-input-block">
            <input name="version" class="layui-input" lay-verify="required" placeholder="请输入主题版本" lay-verType="tips"
                   required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">主题前缀：</label>
        <div class="layui-input-block">
            <input name="prefixes" id="prefixes" class="layui-input" lay-verify="required" placeholder="请输入主题前缀" lay-verType="tips"
                   required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">主题作者：</label>
        <div class="layui-input-block">
            <input name="author" class="layui-input" lay-verify="required" placeholder="请输入主题作者" lay-verType="tips"
                   required/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">主题下载url：</label>
        <div class="layui-input-block">
            <input name="download" id="download" disabled class="layui-input" lay-verify="required" placeholder="请输入主题下载url" lay-verType="tips"
                   required/>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label layui-form-required">主题上传：</label>
        <div class="layui-input-block">
            <button type="button" class="layui-btn layui-btn-primary" id="test4"><i class="layui-icon"></i>只允许压缩文件</button>
        </div>
    </div>


    <div class="layui-form-item text-right">
        <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        <button class="layui-btn" lay-filter="formSubmitBtn" lay-submit>保存</button>
    </div>
</form>

<script>
    layui.use(['layer', 'upload','form', 'admin', 'xnUtil'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var admin = layui.admin;
        var upload = layui.upload;


        upload.render({ //允许上传的文件后缀
            elem: '#test4'
            ,url: '/uploadPicture' //此处配置你自己的上传接口即可
            ,accept: 'file' //普通文件
            ,exts: 'zip|rar|7z' //只允许上传压缩文件
            ,done: function(res){
                $("#download").val(res.data.src.substring(0,res.data.src.indexOf("?")));
                layer.msg('上传成功');
            }
        });

        var editData = admin.getLayerData('#addOrUpdateForm').data;
        form.val('addOrUpdateForm', editData);
        // 表单提交事件
        form.on('submit(formSubmitBtn)', function (data) {
            layer.load(2);
            var url = editData ? getProjectUrl() + 'sysTheme/edit' : getProjectUrl() + 'sysTheme/add';
            admin.req(url, JSON.stringify(data.field), function (res) {
                layer.msg(res.message, {icon: 1, time: 1000}, function () {
                    admin.putLayerData('formOk', true, '#addOrUpdateForm');
                    admin.closeDialog('#addOrUpdateForm');
                });
            }, 'post');
            return false;
        });

    });
</script>